<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
<body  ng-app="myApp">

<!--<div ng-app="" ng-init="firstName='张'">
    <p> 姓名：<input type="text" ng-model="firstName"></p>
    <p>姓名：{{firstName}}</p>
</div>-->

<!--<div ng-app="" ng-init="num1=45;num2=12">
    <p> Num1：<input type="text" ng-model="num1"></p>
    <p> Num2：<input type="text" ng-model="num2"></p>
    <p>姓名：{{num1 * num2}}</p>
</div>-->

<!--<p>重复 HTML 元素</p>
<div ng-app="" ng-init="names=['d','c','e']">
    <p>使用ng-repeat来循环数组</p>
    <ul>
       <li ng-repeat=" x in names">
           {{x}}
       </li>
    </ul>
</div>-->

<!--<p>遍历对象重复 HTML 元素</p>
<div ng-app="" ng-init="names=[{name:'tom',country:'Au'},{name:'san',country:'Ch'},{name:'Kkvv',country:'B'}]">
    <p>使用ng-repeat来循环数组</p>
    <ul>
        <li ng-repeat=" x in names">
            {{x.name + ","+ x.country}}
        </li>
    </ul>
</div>-->


<!--
E 作为元素名使用
A 作为属性使用
C 作为类名使用
M 作为注释使用
-->
<div>
    <test_user></test_user>
    <div test_user></div>
    <div class="test_user"></div>
</div>
<script>
    var app = angular.module("myApp", []);
    app.directive("testUser", function () {
        return {
            restrict: "EAC",
            template: "<h3>这是一个自定义标签</h3>"
        };
    });
</script>
</body>
</html>